<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>首页</title>
    <link rel="stylesheet" href="./swiper/swiper-bundle.min.css">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/min-index.css">
    <script src="../JQ/jquery.js"></script>
    
</head>
<body>
    <div class="header">
        <div class="h">
            <div class="logo">
                <img src="http://www.bufantec.com/site/hunsha/static/img/logo-1.png" alt="">
                <img src="http://www.bufantec.com/site/hunsha/static/img/logo-2.png" alt="">
            </div>
            <div class="h-icon">
                <div class="line"></div>
                <div class="line"></div>
                <div class="line"></div>
            </div>
            <ul class="nav">
                <li class="nav-item">
                    <a href="index.html">首页</a>
                    <span class="line"></span>
                </li>
                <li class="nav-item">
                    <a href="cloth.html">婚纱礼服</a>
                    <span class="line"></span>
                </li>
                <li class="nav-item">
                    <a href="jewerl.html">珠宝配饰</a>
                    <span class="line"></span>
                </li>
                <li class="nav-item">
                    <a href="active.html">最新活动</a>
                    <span class="line"></span>
                </li>
                <li class="nav-item">
                    <a href="about us.html">关于我们</a>
                    <span class="line"></span>
                </li>
            </ul>
        </div>
        <ul class="mask-nav">
            <li class="cur"><a href="./index.html">首页</a></li>
            <li><a href="./cloth.html">婚纱礼服</a></li>
            <li><a href="./jewerl.html">珠宝配饰</a></li>
            <li><a href="./active.html">最新活动</a></li>
            <li><a href="./about us.html">关于我们</a></li>
        </ul>
    </div>
    <div class="banner">
        <div class="swiper-container" id="swiper1">
            <div class="swiper-wrapper">
              <div class="swiper-slide">
                  <img src="./img/banner1.png" alt="">
              </div>
              <div class="swiper-slide">
                  <img src="http://www.bufantec.com/site/hunsha/static/img/banner2.jpg" alt="">
              </div>
            </div>
            <div class="swiper-pagination my-pagination-clickable1"></div>
            <div class="swiper-button-next"></div>
            <div class="swiper-button-prev"></div>
          </div>
            
    </div>
    <div class="dress w">
        <div class="title">
            <h3 class="top">婚纱礼服</h3>
            <h3 class="con">Wedding Dress</h3>
        </div>    
        <!-- <ul class="dress-nav clear">
            <li class="item act">新品/NEW</li>
            <li class="item">2018春夏</li>
            <li class="item">2018秋冬</li>
            <li class="item">专属定制</li>
        </ul> -->


        <div class="swiper-container" id="swiper3">
            <div class="swiper-wrapper">
              <div class="swiper-slide">
                <ul class="clear" id="swiper2">
                    <li>
                        <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-1.jpg" alt="">
                    </li>
                    <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-2.jpg" alt="">
                  </li>
                  <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-3.jpg" alt="">
                  </li>
                  <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-4.jpg" alt="">
                  </li>
                </ul>
              </div>
              <div class="swiper-slide">
                <ul class="clear" id="swiper2">
                    <li>
                        <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-1.jpg" alt="">
                    </li>
                    <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-2.jpg" alt="">
                  </li>
                  <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-3.jpg" alt="">
                  </li>
                  <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-4.jpg" alt="">
                  </li>
                </ul>
              </div>
              <div class="swiper-slide">
                <ul class="clear" id="swiper2">
                    <li>
                        <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-1.jpg" alt="">
                    </li>
                    <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-2.jpg" alt="">
                  </li>
                  <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-3.jpg" alt="">
                  </li>
                  <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-4.jpg" alt="">
                  </li>
                </ul>
              </div>
              <div class="swiper-slide">
                <ul class="clear" id="swiper2">
                    <li>
                        <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-1.jpg" alt="">
                    </li>
                    <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-2.jpg" alt="">
                  </li>
                  <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-3.jpg" alt="">
                  </li>
                  <li>
                      <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-4.jpg" alt="">
                  </li>
                </ul>
              </div>
            </div>
            <!-- Add Pagination -->
            <div class="swiper-pagination my-pagination-clickable2"></div>
            <!-- Add Arrows -->
          </div>


          <!-- <ul class="clear" id="swiper2">
            <li>
                <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-1.jpg" alt="">
            </li>
            <li>
              <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-2.jpg" alt="">
          </li>
          <li>
              <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-3.jpg" alt="">
          </li>
          <li>
              <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-4.jpg" alt="">
          </li>
        </ul> -->
        <div class="more">
            <a href="./cloth.html">MORE</a> 
        </div>
    </div>
    <div class="jew">
        <div class="w">
            <div class="title">
                <h3 class="top">珠宝配饰</h3>
                <h3 class="con">Jewelry Show</h3>
            </div>  
            <ul class="jew-list clear">
                <li class="item">
                    <img src="http://www.bufantec.com/site/hunsha/static/img/jewelry-1.jpg" alt="">
                    <div class="mask">
                        <p>传世之作，经典重现</p>
                        <p>蒂芙尼倾情呈现“斑斓之境”（The Extraordinary Colors of
                            Tiffany）古董珍藏库系列作品，以此纪念品牌在彩色宝石和稀有宝石领域的成就，并完美呈现蒂芙尼的至臻匠心工艺与奇异宝石的瑰丽之美。</p>
                    </div>
                </li>
                <li class="item">
                    <img src="http://www.bufantec.com/site/hunsha/static/img/jewelry-2.jpg" alt="">
                    <div class="mask">
                        <p>传世之作，经典重现</p>
                        <p>蒂芙尼倾情呈现“斑斓之境”（The Extraordinary Colors of
                            Tiffany）古董珍藏库系列作品，以此纪念品牌在彩色宝石和稀有宝石领域的成就，并完美呈现蒂芙尼的至臻匠心工艺与奇异宝石的瑰丽之美。</p>
                    </div>
                </li>
                <li class="item">
                    <img src="http://www.bufantec.com/site/hunsha/static/img/jewelry-3.jpg" alt="">
                    <div class="mask">
                        <p>传世之作，经典重现</p>
                        <p>蒂芙尼倾情呈现“斑斓之境”（The Extraordinary Colors of
                            Tiffany）古董珍藏库系列作品，以此纪念品牌在彩色宝石和稀有宝石领域的成就，并完美呈现蒂芙尼的至臻匠心工艺与奇异宝石的瑰丽之美。</p>
                    </div>
                </li>
                <li class="item">
                    <img src="http://www.bufantec.com/site/hunsha/static/img/jewelry-4.jpg" alt="">
                    <div class="mask">
                        <p>传世之作，经典重现</p>
                        <p>蒂芙尼倾情呈现“斑斓之境”（The Extraordinary Colors of
                            Tiffany）古董珍藏库系列作品，以此纪念品牌在彩色宝石和稀有宝石领域的成就，并完美呈现蒂芙尼的至臻匠心工艺与奇异宝石的瑰丽之美。</p>
                    </div>
                </li>
            </ul>
            <div class="more">
                <a href="./jewerl.html">MORE</a> 
            </div>
        </div>
    </div>
    <div class="new">
        
        <div class="w" >
            <div class="title">
                <h3 class="top">最新活动</h3>
                <h3 class="con">Latest Activities</h3>
            </div>  
            <div class="new-banner">
                <img src="./img/new-box.jpg" alt="">
            </div>
            <ul class="new-list clear">
                <li class="item">
                    <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-2.jpg" alt="">
                    <div class="mask">
                        <p class="time">
                            <span>06-18</span> 
                            <span class="year">2018</span>
                        </p>
                        
                        <p class="new-pro">新品发布会</p>
                        <p class="main">伴随着T台两侧色彩趋势报告的发布，
                            VERONICA2017婚纱新品发布会正...</p>
                        <a href="./active.html" class="more">more &gt;</a>
                    </div>
                </li>
                <li class="item">
                    <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-1.jpg" alt="">
                    <div class="mask">
                        <p class="time">
                            <span>12-24</span> 
                            <span class="year">2017</span>
                        </p>
                        
                        <p class="new-pro">圣诞高级定制发布会</p>
                        <p class="main">《金字塔铭文》中有这样的话：“天空
                            把自己的光芒伸向你，以便你可...</p>
                        <a href="./active.html" class="more">more &gt;</a>
                    </div>
                </li>
                <li class="item">
                    <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-3.jpg" alt="">
                    <div class="mask">
                        <p class="time">
                            <span>06-21</span> 
                            <span class="year">2017</span>
                        </p>
                        
                        <p class="new-pro">夏季新品发布会</p>
                        <p class="main">伴随着T台两侧色彩趋势报告的发布，
                            VERONICA2017婚纱新品发布会正...</p>
                        <a href="./active.html" class="more">more &gt;</a>
                    </div>
                </li>
                <li class="item">
                    <img src="http://www.bufantec.com/site/hunsha/static/img/WeddingDress-6.jpg" alt="">
                    <div class="mask">
                        <p class="time">
                            <span>06-18</span> 
                            <span class="year">2018</span>
                        </p>
                        
                        <p class="new-pro">新品发布会</p>
                        <p class="main">“我非常欣赏并且热爱美国。因为
                            这里是我获得成功的地方。在许...</p>
                        <a href="./active.html" class="more">more &gt;</a>
                    </div>
                </li>
            </ul>
            <div class="mores">
                <a href="./jewerl.html">MORE</a> 
            </div>
            <div class="new-banner2">
                <div class="mask-min">
                    <div class="mores2">
                        <a href="./jewerl.html">MORE</a> 
                    </div>
                </div>
            </div>
        </div>      
    </div>
    <div class="des">
        <div class="w">
            <div class="title">
                <h3 class="top">设计师</h3>
                <h3 class="con">Designers</h3>
            </div> 
            <ul class="des-list clear">
                <li class="item">
                    <div class="prot"></div>
                    <h3>Jason . W</h3>
                    <p class="name-c">首席设计师</p>
                    <p class="content">法国时装设计师，VERONICA品牌创始人之一，设</p>
                    <p class="content2">计总监，2016福布斯最具影响力的设计师,最受欢迎设计大师,确实非常厉害的;</p>
                    <a href="./designers.html">MORE</a>
                </li>
                <li class="item">
                    <div class="prot"></div>
                    <h3>颜澈</h3>
                    <p class="name-c">资深设计师</p>
                    <p class="content">法国时装设计师，VERONICA品牌创始人之一，设</p>
                    <p class="content2">计总监，2016福布斯最具影响力的设计师,最受欢迎设计大师,确实非常厉害的;</p>
                    <a href="./designers.html">MORE</a>
                </li>
                <li class="item">
                    <div class="prot"></div>
                    <h3>Katherine .J</h3>
                    <p class="name-c">运营总监</p>
                    <p class="content">法国时装设计师，VERONICA品牌创始人之一，设</p>
                    <p class="content2">计总监，2016福布斯最具影响力的设计师,最受欢迎设计大师,确实非常厉害的;</p>
                    <a href="./designers.html">MORE</a>
                </li>
            </ul>
        </div>
    </div>
    <div class="about">
        <div class="w">
            <div class="about1">
                <p class="p1">网站备案号：豫ICP备110121210号</p>
                <p class="p2">增值电信业务经营许可证号：豫B2-20100033</p>
                <!-- <p class="p3"></p> -->
            </div>
            <div class="about2">
                <ul class="us clear">
                    <li class="us-item">
                       &copy; 2018 VERONICA
                    </li>
                    <li class="us-item">
                        联系我们
                    </li>
                    <li class="us-item">
                        加入我们
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <script src="./swiper/swiper-bundle.min.js"></script>
    <script src="./js/common.js"></script>
    <script>
        var swiper = new Swiper('#swiper1',{
            loop: true,
            autoplay: {
        delay: 2500,
        disableOnInteraction: false,
      },
            pagination: {
          el: ".swiper-pagination",
          clickable:true,
        //   type: "progressbar",
        clickableClass:'my-pagination-clickable'
        },
        navigation: {
          nextEl: ".swiper-button-next",
          prevEl: ".swiper-button-prev",
          // disabledClass: 'my-button-disabled'
        },
        });

        var swiper3 = new Swiper('#swiper3', {
            noSwiping : true,
      pagination: {
        el: '.swiper-pagination',
        clickable: true,
        renderBullet: function (index, className) {
            switch(index){
            case 0:text='新品/NEW';break;
            case 1:text='2018春夏';break;
            case 2:text='2018秋冬';break;
            case 3:text='专属定制';break;
          }
          return '<p class="' + className + '">' + text + '</p>';
        },
      },
    });
    </script>
</body>
</html>